<template>
  <div>
    <!-- 表格 -->
        <el-button @click="table">获取</el-button>
        <el-button @click="open2">删除</el-button>
        <tableIndex :tables='tableData'></tableIndex>
        <!-- 树形控件 -->
        <el-tree show-checkbox :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree>

        <!-- 分页 -->
        <paginationIndex :pagination='paginations'></paginationIndex>
  </div>
</template>

<script>
import tableIndex from '@/components/commons/Table/index.vue'
import paginationIndex from '@/components/commons/Pagination/index.vue'

import {getUserList} from "@/api/user"

export default {
  name: 'ceshiyemian',
  components:{
     tableIndex,//表格,
     paginationIndex,//分页
  },
  data(){
      return{
centerDialogVisible:true,
        //   账户列表
          tableData:[],
          // 分页
          paginations:{},

          // 树形
          data: [{
          label: '一级 1',
          children: [{
            label: '二级 1-1',
            children: [{
              label: '三级 1-1-1'
            }]
          }]
        }, {
          label: '一级 2',
          children: [{
            label: '二级 2-1',
            children: [{
              label: '三级 2-1-1'
            }]
          }, {
            label: '二级 2-2',
            children: [{
              label: '三级 2-2-1'
            }]
          }]
        }, {
          label: '一级 3',
          children: [{
            label: '二级 3-1',
            children: [{
              label: '三级 3-1-1'
            }]
          }, {
            label: '二级 3-2',
            children: [{
              label: '三级 3-2-1'
            }]
          }]
        }],
        defaultProps: {
          children: 'children',
          label: 'label'
        }
      }
  },
  methods:{
      table(){
        //   调用账户列表
        getUserList({
            queryText:'',
            memberTypeID:'',
            pageIndex:0,
            pageSize:''
        }).then(res=>{
            console.log(res)
            this.paginations={
              pageIndex:1,
              pageSize:20,
              total:100,
            }
        })
      },

      open2() {
        this.$confirm('', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type:'',
          message:'是否要删除此按钮',
          center:false,
          showClose:false,
          center:true
        }).then(() => {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });          
        });
      },
      // 树形
      handleNodeClick(data) {
        console.log(data);
      }
  },
  created(){
    layui.use(['layer', 'form'], function(){
    var layer = layui.layer
    form = layui.form;
    
    layer.msg('Hello World');
});
  }
}
</script>

<style  scoped>
el-dialog .el-message-box--center .el-message-box{
  width: 200px!important;
}
</style>
